/**
 * popup服务
 */
import { createApp, h } from 'vue';
import { Subject } from 'rxjs';
import Popup from './popup.vue';

export interface ILMSDisplay {
  onADZoneActived(data: any, e: any): void;
  onADZoneSelected(data: any, e: any): void;
  Release(): void;
  m_ThreeMap: any;
}

export interface IPopup {
  Show: (coordinate: number[]) => void;
  Hide: () => void;
}

class PopupService {
  private popupIns!: IPopup | null;
  private tplVue: any;
  private static _ins: PopupService;
  public static getIns(lmsDisplay?: any) {
    if (!this._ins || !this._ins.popupIns) {
      this._ins = new PopupService(lmsDisplay);
    }
    return this._ins;
  }
  public subject$ = new Subject();
  constructor(lmsDisplay?: ILMSDisplay) {
    const options_popup = {
      element: '<div id="gis-popup"></div>',
    };
    this.popupIns = lmsDisplay ? lmsDisplay.m_ThreeMap.getView().getPopupManager().Add(options_popup) : null;
  }

  show(coordinate: number[], data: any) {
    this.close(); // 销毁上一个popup
    const PopupComp = h(Popup, {
      name: data.name,
      handleClose: this.close.bind(this),
    });
    this.tplVue = createApp(PopupComp);
    this.tplVue.mount('#gis-popup');

    this.popupIns?.Show(coordinate);

    // return this.popupIns;
  }

  close() {
    this.tplVue?.unmount();
  }

  clear() {
    this.popupIns = null;
  }
}

export { PopupService };
